<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="bodydiv">
        <!-- 上导航 -->
        <div class="hear">
            <div class="new_heard">
                <img src="../LOL官网/img/0.jpg" alt="" class="body_img">
            </div>

            <div class="hearder">
                <div class="headerdiv">
                    <a href="#" title="英雄联盟官网" class="logo">
                        <img src="../LOL官网/img/logo-public.png" alt="">
                    </a>
                    <ul class="hearder_menu">
                        <li>
                            <a href="#" class="heardermenu_a">
                                <span class="heardermenu_title">
                                    游戏资料
                                </span>
                                <span class="heardermenu_list">
                                    GAME INFO
                                </span>
                            </a>

                        </li>
                        <li>
                            <a href="#" class="heardermenu_a">
                                <span class="heardermenu_title">
                                    商业/合作
                                </span>
                                <span class="heardermenu_list">
                                    STORE
                                </span>
                            </a>

                        </li>
                        <li>
                            <a href="#" class="heardermenu_a">
                                <span class="heardermenu_title">
                                    社区互动
                                </span>
                                <span class="heardermenu_list">
                                    COMMUNITY
                                </span>
                            </a>

                        </li>
                        <li>
                            <a href="#" class="heardermenu_a">
                                <span class="heardermenu_title">
                                    赛事官网
                                </span>
                                <span class="heardermenu_list">
                                    ESOIRTS
                                </span>
                            </a>

                        </li>
                        <li>
                            <a href="#" class="heardermenu_a">
                                <span class="heardermenu_title">
                                    自助系统
                                </span>
                                <span class="heardermenu_list">
                                    SYSTEM
                                </span>
                            </a>

                        </li>
                    </ul>
                    <a href="#" class="hearder_search search_i1">
                        <i class="hearder_i1"></i>
                    </a>
                    <div class="hearder_hidden">
                        <a href="#" class="hearderhidden_a1"><i class="hearder_i1 z"></i>
                        </a>
                        <input type="text" placeholder="搜索 lol.qq.com" class="hearder_search1">
                        <a href="#" class="hearderhidden_a2">
                            <i class="iconfont xxx"></i>
                        </a>
                    </div>
                    <a href="#" class="hearder_search search_i2">
                        <i class="hearder_i2"></i>
                    </a>

                    <div class="hearder_user">
                        <div class="hearderuser_logo">
                            <a href="#">
                                <img src="../LOL官网/img/default.png" alt="">
                                <span></span>
                            </a>
                        </div>
                        <div class="hearderuser_p">
                            <p class="hearderuserp1">亲爱的召唤师，欢迎</p>
                            <a href="#">
                                <p class="hearderuserp2">登录</p>
                            </a>
                        </div>
                    </div>
                    <div class="bottom_box">
                        <a href="#" class=bottombox_info>查看详情</a>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="bodyde">
        <div class="box1">
            <div class="box1_itme">
                <div class="box1_img">
                    <img src="../LOL官网/img/01.jpeg" alt="" class="img01">
                </div>
                <div class="box1_div">
                    <span>全球总决赛通行证</span>
                    <span>K/DA ALL OUT</span>
                    <span>K/DA最新EP</span>
                    <span>周边年末回馈</span>
                    <span>2021季前赛 开创神话</span>
                </div>
            </div>
            <div class="box2">
                <div class="box2_hearder">
                    <ul class="box2_list">
                        <li class="box2list_li">
                            <a href="#">综合</a>
                        </li>
                        <li class="box2list_li">
                            <a href="#">公告</a>
                        </li>
                        <li class="box2list_li">
                            <a href="#">赛事</a>
                        </li>
                        <li class="box2list_li">
                            <a href="#">攻略</a>
                        </li>
                        <li class="box2list_li li_last">
                            <a href="#">社区</a>
                        </li>
                    </ul>
                </div>
                <div class="box2_body">
                    <div class="box2body_hearder">
                        <ul class="box2body_list">
                            <li class="box2body_first">
                                <a href="#">英雄联盟11.11活动预告</a>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                            <li class="box2body_itme">
                                <span class="box2body_itme_info">公告</span>
                                <a href="#">2020排位赛季即将结束</a>
                                <span class="data">11-04</span>
                            </li>
                        </ul>
                        <a href="#" class="box2body_more">阅读更多<span>最新资讯 <i class="box2_more"></i></span></a>
                    </div>
                </div>
            </div>
            <div class="box3">
                <div class="box3_hearder">
                    <h2>热门活动</h2>
                    <ul class="box3hearder_list">
                        <li class="box3_list1">正在进行</li>
                        <li class="box3_list2">商城特惠</li>
                        <li class="box3_list3">长期活动</li>
                    </ul>
                    <a href="#" class="box3hearder_a">更多></a>
                </div>
                <div class="box3_itme">
                    <ul class="box3itme_list">
                        <li class="box3list1">
                            <a href="#" class="box3list1_a">
                                <img src="../LOL官网/img/lol KDA.jpg" alt="" class="box3list1_img">
                                <span class="box3list1_info">K/DA音乐零距离之旅</span>
                                <span class="box3list1_day">19天后结束</span>
                                <div class="hiddenbox">
                                    <a href="#" class="hiddenbox_a">
                                        <h4>K/DA音乐零距离之旅</h4>
                                        <p class="hiddenbox_p1">K/DA系列重磅内容即将到来</p>
                                        <p class="hiddenbox_p2">2020-10-25 - 2020-11-30</p>
                                    </a>
                                </div>
                            </a>
                        </li>
                        <li class="box3list2">
                            <a href="#" class="box3list1_a">
                                <img src="../LOL官网/img/lol KDA.jpg" alt="">
                                <span class="box3list1_info">K/DA音乐零距离之旅</span>
                                <span class="box3list1_day">19天后结束</span>
                                <div class="hiddenbox">
                                    <a href="#" class="hiddenbox_a">
                                        <h4>K/DA音乐零距离之旅</h4>
                                        <p class="hiddenbox_p1">K/DA系列重磅内容即将到来</p>
                                        <p class="hiddenbox_p2">2020-10-25 - 2020-11-30</p>
                                    </a>
                                </div>
                            </a>
                        </li>
                        <li class="box3list3">
                            <a href="#" class="box3list1_a">
                                <img src="../LOL官网/img/lol KDA.jpg" alt="">
                                <span class="box3list1_info">K/DA音乐零距离之旅</span>
                                <span class="box3list1_day">19天后结束</span>
                                <div class="hiddenbox">
                                    <a href="#" class="hiddenbox_a">
                                        <h4>K/DA音乐零距离之旅</h4>
                                        <p class="hiddenbox_p1">K/DA系列重磅内容即将到来</p>
                                        <p class="hiddenbox_p2">2020-10-25 - 2020-11-30</p>
                                    </a>
                                </div>
                            </a>
                        </li>
                        <li class="box3list4">
                            <a href="#" class="box3list1_a">
                                <img src="../LOL官网/img/lol KDA.jpg" alt="">
                                <span class="box3list1_info">K/DA音乐零距离之旅</span>
                                <span class="box3list1_day">19天后结束</span>
                                <div class="hiddenbox">
                                    <a href="#" class="hiddenbox_a">
                                        <h4>K/DA音乐零距离之旅</h4>
                                        <p class="hiddenbox_p1">K/DA系列重磅内容即将到来</p>
                                        <p class="hiddenbox_p2">2020-10-25 - 2020-11-30</p>
                                    </a>
                                </div>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="box4">
                <ul class="box4_list">
                    <li class="box4list_1">
                        <a href="#">
                            下载游戏
                            <span>DOWNLOAD THE GAME</span>
                        </a>
                    </li>
                    <li class="box4list_2">
                        新手必备
                    </li>
                    <li class="box4list_3">
                        新手必备
                    </li>
                    <li class="box4list_4">
                        <a href="#" class="box4list_a">

                            <i class="iconfont box4list_i">&#xf00ec;</i> 在线客服
                        </a>
                    </li>
                    <li class="box4list_5">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_6">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_7">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_8">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_9">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_10">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                    <li class="box4list_11">
                        <a href="#" class="box4list_a">
                            <i class="iconfont box4list_i">&#xf00ec;</i>在线客服
                        </a>
                    </li>
                </ul>
            </div>
            <div class="box5">
                <div class="box5_div1">
                    <span>新英雄</span>
                    <div class="box5div1">
                        <p class="box5div1_info1">新英雄攻略抢先一览</p>
                        <p class="box5div1_info2">萨格芬妮现已登陆峡谷！</p>
                    </div>
                    <a href="#" class="box5hidde">
                        <i class="img_border"></i>
                        <p>萨格芬妮现已登录峡谷!</p>
                        <a href="#" class="box5hidde_a"> 查看详情
                            <i class="iiiii"></i>
                        </a>
                    </a>
                </div>

                <div class="box5_div2">
                    <span>新皮肤</span>
                    <div class="box5div1">
                        <p class="box5div1_info1">星光更盛 再谱新声</p>
                        <p class="box5div1_info2">K/DA ALL OUT</p>
                    </div>
                </div>
            </div>
            <div class="box6">
                <div class="box6_div1"></div>
                <div class="box6_div2"></div>
                <div class="box6_div3"></div>
                <div class="box6_div4">
                    <a href="#">
                        <i class="box6div4_left"></i> 周 免
                        <i class="box6div4_mid"></i>
                        <i class="box6div4_right"></i>
                    </a>
                </div>
            </div>
        </div>
        <div class="box2_itme">
            <div class="box2itme_div">
                <div class="box2itme_info">
                    <div class="box2itme_hearder">
                        <h2>最新视频</h2>
                        <ul class="box2hearder_list">
                            <li class="box2_list1">推荐</li>
                            <li class="box2_list2">官方</li>
                            <li class="box2_list3">娱乐</li>
                            <li class="box2_list4">赛事</li>
                            <li class="box2_list5">云顶之奕
                                <i class="box2list_new"></i>
                            </li>
                            <li class="box2_list6">教学</li>
                        </ul>
                        <a href="#" class="box3hearder_a">更多<i class="box_morea"></i></a>
                    </div>
                    <div class="box2itme_body">
                        <ul class="box2itme_list">
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                            <li class="box2itmelist1">
                                <a href="#" class="box2itmelist1_a">
                                    <img src="../LOL官网/img/tu1.png" alt="">
                                    <div class="box2itmelist1_div">
                                        <p>
                                            K/DA与百事可乐无糖 联合态度音乐大片已上线!</p>
                                        <span class="box2span_number">5422次播放</span>
                                        <span class="box2span_time">2020-11-06</span>
                                    </div>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="box2itme_info1">
                    <div class="info_hearder">
                        <h2>最新视频</h2>
                        <ul class="infohearder_list">
                            <li class="info_list1">周一</li>
                            <li class="info_list2">周二</li>
                            <li class="info_list3">周三</li>
                            <li class="info_list4">周四</li>
                            <li class="info_list5">周五 </li>
                            <li class="info_list6">周六</li>
                            <li class="info_list7">周日</li>
                        </ul>
                        <a href="#" class="box3hearder_a">更多<i class="box_morea"></i></a>
                    </div>
                    <div class="info_body">
                        <ul class="info_body_list">
                            <li>
                                <a href="#" class="info_body_a">
                                    <img src="../LOL官网/img/top.jpg" alt="">
                                    <h4 class="info_body_info">起小点top10</h4>
                                    <p class="info_body_time">2020-11-4更新</p>
                                </a>
                                <a href="#" class="info_body_a1">
                                    起小点TOP10集合国服/外服一周的精彩操作镜头
                                </a>
                                <a href="#" class="info_body_a2">
                                    <img src="../LOL官网/img/datui.jpg" alt=""> 联盟是大腿
                                </a>
                            </li>
                            <li>
                                <a href="#" class="info_body_a">
                                    <img src="../LOL官网/img/top.jpg" alt="">
                                    <h4 class="info_body_info">起小点top10</h4>
                                    <p class="info_body_time">2020-11-4更新</p>
                                </a>
                                <a href="#" class="info_body_a1">
                                    起小点TOP10集合国服/外服一周的精彩操作镜头
                                </a>
                                <a href="#" class="info_body_a2">
                                    <img src="../LOL官网/img/datui.jpg" alt=""> 联盟是大腿
                                </a>
                            </li>
                            <li>
                                <a href="#" class="info_body_a">
                                    <img src="../LOL官网/img/top.jpg" alt="">
                                    <h4 class="info_body_info">起小点top10</h4>
                                    <p class="info_body_time">2020-11-4更新</p>
                                </a>
                                <a href="#" class="info_body_a1">
                                    起小点TOP10集合国服/外服一周的精彩操作镜头
                                </a>
                                <a href="#" class="info_body_a2">
                                    <img src="../LOL官网/img/datui.jpg" alt=""> 联盟是大腿
                                </a>
                            </li>
                        </ul>

                    </div>
                    <a href="#" class="info_bottom">
                        前往视频中心
                        <i class="info_bottom_img"></i>
                    </a>
                </div>
            </div>
        </div>

    </div>
</body>

</html>